<template>
    <div>
        <link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
        <tab-bar>
          <tab-bar-item path="/home" activecolor="pink">
            <i slot="icon" class="layui-icon layui-icon-home"></i>
            <div slot="text">首页</div>
           </tab-bar-item>
          <tab-bar-item path="/category" activecolor="pink">
            <i slot="icon" class="layui-icon layui-icon-app"></i>
            <div slot="text">分类</div>
          </tab-bar-item>
          <tab-bar-item path="/cart" activecolor="pink">
            <i slot="icon" class="layui-icon layui-icon-cart"></i>
            <div slot="text">购物车</div>
          </tab-bar-item>
          <tab-bar-item path="/user" activecolor="pink">
            <i slot="icon" class="layui-icon layui-icon-user"></i>
            <div slot="text">我的</div>
          </tab-bar-item>
        </tab-bar>
      <router-view/>
    </div>
</template>

<script>
  import TabBar from "../common/tabbar/TabBar";
  import TabBarItem from "../common/tabbar/TabBarItem";
  import Home from "../../views/home/Home";
  export default {
        name: "mainTabBar",
      components:{
          TabBarItem,
          TabBar,
          Home
      }
  }
</script>

<style scoped>

</style>
